<%@ page language="java" pageEncoding="UTF-8" %>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Oleose App Landing Page | Bootstrap Theme</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <link rel="shortcut icon" href="/img/favicon.png">
    <link rel="stylesheet" href="/bootstrap-3.3.5/css/bootstrap.css">
    <link rel="stylesheet" href="/css/font-awesome.min.css">
    <link rel="stylesheet" href="/css/animate.css">
    <link rel="stylesheet" href="/css/slick.css">
    <link rel="stylesheet" href="/js/rs-plugin/css/settings.css">
    <link rel="stylesheet" href="/css/eco.css"/>
</head>

<body>
<div class="pre-loader">
    <div class="load-con">
        <img src="/img/eco/logo.png" alt="">

        <div class="spinner">
            <div class="bounce1"></div>
            <div class="bounce2"></div>
            <div class="bounce3"></div>
        </div>
    </div>
</div>

<%--<header>
    <nav class="navbar navbar-default navbar-fixed-top scrolled" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#baby-menu">
                    <span class="fa fa-bars fa-lg"></span>
                </button>
                <a class="navbar-brand" href="index.html">
                    <img src="img/eco/logo.png" alt="" class="logo">
                </a>
            </div>
            <div class="collapse navbar-collapse" id="baby-menu">

                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#home">园区介绍</a>
                    </li>
                    &lt;%&ndash;<li><a href="#staff">师资力量</a>
                    </li>
                    <li><a href="#feature">教学特色</a>
                    </li>&ndash;%&gt;
                    <li><a href="#screens">班级相册</a>
                    </li>
                    &lt;%&ndash;<li><a href="#week">每周食谱</a>
                    </li>
                    <li><a href="#info">招生简章</a>
                    </li>&ndash;%&gt;
                    <li><a href="#work">精彩活动</a>
                    </li>
                   &lt;%&ndash; <li><a href="#notice">通知公告</a>
                    </li>
                    <li><a href="#login">在线报名</a>
                    </li>&ndash;%&gt;
                </ul>
            </div>
        </div>
    </nav>
</header>--%>
<div class="wrapper">
    <section id="about">
        <div class="container">
            <div class="section-heading active">
                <img src="img/banner/b1-.jpg"  alt="" class="responsive col-xs-12"/>
            </div>

            <div class="row">
                <div class="col-md-4 col-sm-4 col-xs-4">
                    <div class="about-item active">
                        <i class="fa fa-home fa-2x"></i>
                        <h3>园区介绍</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4" >
                    <div class="about-item active">
                        <i class="fa fa-group  fa-2x"></i>
                        <h3>师资力量</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4">
                    <div class="about-item active">
                        <i class="fa fa-star  fa-2x"></i>
                        <h3>教学特色</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4" >
                    <div class="about-item active">
                        <i class="fa fa-camera  fa-2x"></i>
                        <h3>班级相册</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4" >
                    <div class="about-item active">
                        <i class="fa fa-child fa-2x"></i>
                        <h3>每周食谱</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4" >
                    <div class="about-item active">
                        <i class="fa fa-university fa-2x"></i>
                        <h3>招生简章</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4" >
                    <div class="about-item active">
                        <i class="fa fa-smile-o fa-2x"></i>
                        <h3>精彩活动</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4" >
                    <div class="about-item active">
                        <i class="fa fa-bell  fa-2x"></i>
                        <h3>通知公告</h3>
                    </div>
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4" >
                    <div class="about-item active">
                        <i class="fa  fa-graduation-cap fa-2x"></i>
                        <h3>在线报名</h3>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section id="reviews">
         <div class="container">
             <div class="section-heading inverse active">
                 <h1>教师风采</h1>

                 <div class="divider"></div>
                 <p>咱们有外教</p>
             </div>
             <div class="row">
                 <div class="col-md-10 col-md-push-1 active">
                     <div class="review-filtering">
                         <div class="review">
                             <div class="row">
                                 <div class="col-md-2">
                                     <div class="review-person">
                                         <img src="http://api.randomuser.me/portraits/women/94.jpg" alt=""
                                              class="img-responsive">
                                     </div>
                                 </div>
                                 <div class="col-md-10">
                                     <div class="review-comment">
                                         <h3>教英语的阿姨</h3>

                                         <p>
                                             - 其实我是前端
                                                 <span>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star-o fa-lg"></i>
                                                 </span>
                                         </p>
                                     </div>
                                 </div>
                             </div>
                         </div>
                         <div class="review">
                             <div class="row">
                                 <div class="col-md-2">
                                     <div class="review-person">
                                         <img src="http://api.randomuser.me/portraits/men/70.jpg" alt=""
                                              class="img-responsive">
                                     </div>
                                 </div>
                                 <div class="col-md-10">
                                     <div class="review-comment" >
                                         <h3>叫体育的老爷</h3>

                                         <p>
                                             - 其实我是java程序员
                                                 <span>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star-half-o fa-lg"></i>
                                                     <i class="fa fa-star-o fa-lg"></i>
                                                 </span>
                                         </p>
                                     </div>
                                 </div>
                             </div>
                         </div>
                         <div class="review">
                             <div class="row">
                                 <div class="col-md-2">
                                     <div class="review-person">
                                         <img src="http://api.randomuser.me/portraits/men/93.jpg" alt=""
                                              class="img-responsive">
                                     </div>
                                 </div>
                                 <div class="col-md-10">
                                     <div class="review-comment">
                                         <h3>别逗了我是校长</h3>

                                         <p>
                                            其实是个怪蜀黍
                                                 <span>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star fa-lg"></i>
                                                     <i class="fa fa-star-half-o fa-lg"></i>
                                                     <i class="fa fa-star-o fa-lg"></i>
                                                 </span>
                                         </p>
                                     </div>
                                 </div>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </section>

    <section id="screens">
        <div class="container">

            <div class="section-heading avctive">
                <h1>按钮的测试组件</h1>

                <div class="divider"></div>
                <p>按钮组合+每日食谱的图片</p>
            </div>

            <div class="filter active">
                <a href="javascript:void(0)" class="button js-filter-all active">All Screens</a>
                <a href="javascript:void(0)" class="button js-filter-one">User Access</a>
                <a href="javascript:void(0)" class="button js-filter-two">Social Network</a>
                <a href="javascript:void(0)" class="button js-filter-three">Media Players</a>
            </div>
            <div class="slider filtering avtive">
                <div class="one">
                    <img src="img/eco/screens/profile.jpg" alt="">
                    <h4>Profile Page</h4>
                </div>
                <div class="two">
                    <img src="img/eco/screens/menu.jpg" alt="">
                    <h4>Toggel Menu</h4>
                </div>
                <div class="three">
                    <img src="img/eco/screens/weather.jpg" alt="">
                    <h4>Weather Forcast</h4>
                </div>
                <div class="one">
                    <img src="img/eco/screens/signup.jpg" alt="">
                    <h4>Sales Analysis</h4>
                </div>
                <div class="one">
                    <img src="img/eco/screens/calendar.jpg" alt="">
                    <h4>Event Calendar</h4>
                </div>
                <div class="two">
                    <img src="img/eco/screens/options.jpg" alt="">
                    <h4>Some Options</h4>
                </div>
                <div class="three">
                    <img src="img/eco/screens/sales.jpg" alt="">
                    <h4>Lorem ipsum dolor</h4>
                </div>
            </div>
        </div>
    </section>

    <section id="demo">
         <div class="container">
             <div class="section-heading avtive">
                 <h1>视频</h1>

                 <div class="divider"></div>
                 <p>视频组件</p>
             </div>
             <div class="row">
                 <div class="col-md-8 col-md-offset-2 video-container avtive" style="border-radius: 15px;min-height: 200px;">
                         <video controls="controls" style="width: 100%">
                             <source src="vodio/test.mp4" type="video/mp4">
                         </video>
                 </div>
             </div>
         </div>
     </section>

    <section id="getApp">
         <div class="container-fluid">
             <div class="section-heading inverse ">
                 <h1>登陆样式</h1>

                 <div class="divider"></div>
                 <p>谁黑</p>
             </div>

             <div class="row">
                 <div class="col-md-12">
                     <div class="hanging-phone avtive">
                         <img src="img/eco/eco-angled2.png" alt="">
                     </div>
                     <div class="platforms">

                     </div>

                 </div>
             </div>


         </div>
     </section>

    <section id="support">
        <div class="container">
            <div class="section-heading active">
                <h1>Support</h1>

                <div class="divider"></div>
                <p>For more info and support, contact us!</p>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="row">
                        <div class="col-md-8 col-sm-8 active">
                            <form role="form">
                                <div class="form-group">
                                    <input type="text" class="form-control" placeholder="Your name">
                                </div>
                                <div class="form-group">
                                    <input type="email" class="form-control" placeholder="Your email">
                                </div>
                                <div class="form-group">
                                    <textarea cols="30" rows="10" class="form-control"
                                              placeholder="Your message"></textarea>
                                </div>
                                <button type="submit" class="btn btn-primary btn-lg">Submit</button>
                            </form>
                        </div>
                        <div class="col-md-4 col-sm-4 contact-details active">
                            <div class="media">
                                <a class="pull-left" href="#">
                                    <i class="fa fa-map-marker fa-2x"></i>
                                </a>

                                <div class="media-body">
                                    <h4 class="media-heading">4, Some street, California, USA</h4>
                                </div>
                            </div>
                            <div class="media">
                                <a class="pull-left" href="#">
                                    <i class="fa fa-envelope fa-2x"></i>
                                </a>

                                <div class="media-body">
                                    <h4 class="media-heading">
                                        <a href="mailto:support@oleose.com">support@oleose.com</a>
                                    </h4>
                                </div>
                            </div>
                            <div class="media">
                                <a class="pull-left" href="#">
                                    <i class="fa fa-phone fa-2x"></i>
                                </a>

                                <div class="media-body">
                                    <h4 class="media-heading">+1 234 567890</h4>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <footer>
        <div class="container">
            <a href="#" class="active">
                <img src="img/eco/logo.png" alt="" class="logo">
            </a>
            <div class="social">
                <a href="#" class="active"><i class="fa fa-twitter fa-lg"></i></a>
                <a href="#" class="active"><i class="fa fa-google-plus fa-lg"></i></a>
                <a href="#" class="active"><i class="fa fa-facebook fa-lg"></i></a>
            </div>
            <div class="rights">
                <p>Copyright &copy; 2015 微信幼儿园</p>
            </div>
        </div>
    </footer>

</div>
<script src="/support/jquery-1.11.1.min.js"></script>
<script src="/bootstrap-3.3.5/js/bootstrap.min.js"></script>
<script src="/js/slick.min.js"></script>
<script src="/js/placeholdem.min.js"></script>
<script src="/js/rs-plugin/js/jquery.themepunch.plugins.min.js"></script>
<script src="/js/rs-plugin/js/jquery.themepunch.revolution.min.js"></script>
<script src="/js/waypoints.min.js"></script>
<script src="/js/baby.js"></script>
<script>
    $(document).ready(function () {
        babyMaster.preLoader();
    });
</script>
